﻿<link href="/plugins/lgform/lg.form.2.1.css" rel="stylesheet" />
<style>
    #ApplyInfo {
        position: relative
    }

        #ApplyInfo .lg-search-container {
            padding: 0;
        }

        #ApplyInfo .lg-search {
            border-bottom: 1px solid #f0f0f0;
            background: #fff;
            padding-bottom: 10px;
            margin-bottom: 10px;
            position: sticky;
            top: 0;
            z-index: 2;
            width: 100%;
            padding: 10px;
        }

        #ApplyInfo .lg-plans {
            padding: 0 10px;
        }

        #ApplyInfo li.lg-plans-item {
            line-height: 35px;
            margin: 5px 0;
            padding: 0 5px;
            border: 1px solid #f0f0f0;
            cursor: pointer;
            position: relative;
        }

            #ApplyInfo li.lg-plans-item .fa-check {
                position: absolute;
                top: 0;
                right: 0;
                z-index: 2;
                color: #fff;
                font-size: 10px;
            }

            #ApplyInfo li.lg-plans-item:after {
                width: 0;
                height: 0;
                border-top: 20px solid #1E9FFF;
                border-left: 20px solid transparent;
                content: "";
                display: none;
                position: absolute;
                top: 0;
                right: 0;
            }

            #ApplyInfo li.lg-plans-item.selected:after {
                display: block;
            }

            #ApplyInfo li.lg-plans-item.selected {
                color: #1E9FFF;
            }

        /*标签组*/
        #ApplyInfo .lg-tag-group {
            display: flex;
            flex-wrap: wrap;
        }

            #ApplyInfo .lg-tag-group .lg-tag-item {
                border: 1px dashed #ccc;
                margin: 6px;
                padding: 3px 6px;
                display: flex;
            }

                #ApplyInfo .lg-tag-group .lg-tag-item span.fa {
                    line-height: 28px;
                    margin-left: 5px;
                    cursor: pointer;
                }

                    #ApplyInfo .lg-tag-group .lg-tag-item span.fa:hover {
                        color: #007DDB;
                    }

                #ApplyInfo .lg-tag-group .lg-tag-item:hover {
                    background: #f9f9f9;
                }

        #ApplyInfo .lg-addTip {
            border: 1px dashed #ccc;
            margin: 6px;
            padding: 3px 6px;
            line-height: 2;
            text-align: center;
            cursor: pointer;
        }

            #ApplyInfo .lg-addTip:hover {
                background: #f9f9f9;
                color: #007DDB;
            }
</style>
<div class="layui-card" id="ApplyInfo">

    <div class="layui-card-header">
        <i class="fa fa-home fa-fw"></i>求职详情
        <div class="f-r">
            <button class="layui-btn layui-btn-primary layui-btn-sm" v-on:click="back()">
                <i class="fa fa-mail-reply fa-fw"></i>返回
            </button>
        </div>
    </div>
    <div class="layui-card-body" id="">
        <lg-form :data="form" v-on:event="onEvent"  :render-type="1"></lg-form>
    </div>

</div>
<script type="module">
    import { freeForm } from '/plugins/lgform/lg.form.2.1.js';
    frame.createPage({
        mounted: function () {
            var page = this;
            var app = Vue.createApp({
                data() {
                    return {
                        job: null, // 单个job
                        form: [], // 万能表单数据
                    }
                },
                mounted() {
                    this.init();
                },
                methods: {
                    init:async function(){
                        //获取报名表实体并将表单数据取出并格式化
                        var res= await this.getJob();
                        if (res.code == 0) {
                            if (res.data != null) {
                                this.job = freeForm.toJson(res.data.FormData);
                            }
                        } else {
                            layer.msg(res.msg, {
                                icon: 2
                            });
                            return false;
                        }
                        //通过jobId获取表单配置数据
                        res= await this.getForm(res.data.JobId);
                        if(res.code!=0){
                            res = await this.getBaseForm();
                        }
                        if (res.code != 0) {
                            layer.msg("表单数据获取异常！",{icon:2})
                        } 
                        var data = freeForm.toJson(res.data.Items, []);
                        this.form = freeForm.toFormData(data, this.job)
                    },
                    // 获取单个的内容
                    getJob: async function (id) {
                        return await lg.requestAsync({
                            url: "/api/sys/recruit/getvita",
                            data: { id: @ViewBag.id },
                            success: res => {
                                return res;
                            }
                        })
                    },
                    getBaseForm: async function () {
                        return await lg.requestAsync({
                            url: "/api/sys/recruit/GetBaseForm",
                            success: res => {
                               return res;
                            }
                        })
                    },
                    // 获取申请表单
                    getForm: async function (id) {
                        return await lg.requestAsync({
                            url: "/api/sys/recruit/GetBaseForm",
                            success: res => {
                                return res;
                            }
                        })
                    },
                    onEvent:function(data){
                        console.log(data);
                    },
                    // 返回
                    back: function () {
                        frame.Back(page.url, res => {
                            res.reload();
                        })
                    },
                }
            })
            freeForm.regComponent(app);
            app.mount("#ApplyInfo")
        }
    }).mount();
</script>